<template>
	<view class="content">
		<view class="row b-b">
			<text class="tit">发票类型</text>
			<picker @change="bindPickerChange" :value="index" :range="array" class="picker">
			                        <view class="uni-input">{{array[index]}}</view>
			                    </picker>
			<text class="yticon icon-xia" ></text>
			
		</view>
		<view class="row b-b" style="height: 120upx;">
			<text class="text">电子普通发票是税局认可的有效凭证，其法律效力、基本用途及 使用规定同纸质发票</text>
		</view>
		
		<view class="info" v-if="index==0">
			<view class="row b-b" >
				<text class="tit">*发票抬头</text>
				<text class="addr-btn" :class="checknum==1?'active':''" @click="check(1)">个人</text>
				<text class="addr-btn" :class="checknum==2?'active':''" @click="check(2)">企业</text>
			</view>
			
			<view class="row default-row b-b">
				<!-- <text class="tit">个人</text> -->
				<input type="text" class="input" v-model="title" placeholder="发票抬头" placeholder-class="placeholder" disabled>
			</view>
			<view class="row default-row b-b" v-if="checknum == 2">
				<!-- <text class="tit">个人</text> -->
				<input type="text" class="input" v-model="corpWholeName" placeholder="输入单位名称" placeholder-class="placeholder">
			</view>
			<view class="row default-row b-b" v-if="checknum == 2">
				<!-- <text class="tit">个人</text> -->
				<input type="text" class="input" placeholder="*纳税人识别号" v-model="itin" placeholder-class="placeholder">
			</view>
			
		</view>
		<view class="info">
			<view class="row" >
				<text class="tit">收票人手机</text>
				<input type="number" class="input" v-model="phone" placeholder="输入收票人手机" />
			</view>
			
			<view class="row" >
				<text class="tit">收票人邮箱</text>
				<input type="email" class="input" v-model="email" placeholder="输入收票人邮箱" />
			</view>
			
		</view>
		
		<view class="row default-row">
			<text class="tit">设为默认</text>
			<switch :checked="is_default" color="#fa436a" @change="is_default = !is_default" style="transform:scale(0.7)" />
		</view>
	
	</view>
</template>

<script>
	export default {
		components:{
		
		},
		data() {
			return {
				 array: ['电子发票'],
				 index: 0,
				 checknum:'1',
				 phone:'',
				 email:"",
				 corpWholeName:"",
				 itin:'',
				 title:'个人',
				 content:"",
				 type:'',
				 id:'',
				 is_default:false,
				 invoiceData:""
			}
		},
		onLoad(option){
			this.type = option.type
			if(this.type == "edit"){
				this.invoiceData = this.$SysCache.get("invoiceData")
				this.checknum = this.invoiceData.type
				this.corpWholeName = this.invoiceData.company_name
				this.email = this.invoiceData.email
				this.is_default = this.invoiceData.is_default==1?true:false
				this.phone = this.invoiceData.mobile
				this.itin = this.invoiceData.taxpayer_code
				this.title = this.invoiceData.title
				this.id = this.invoiceData.id
				
			}
		},
		methods: {
			
			check(str){
				this.checknum = str
				if(str == 1){
					this.title = "个人"
				}else{
					this.title = "企业"
				}
				
			},
			switchChange(e){
				this.addressData.default = e.detail;
			},
			bindPickerChange: function(e) {
				console.log('picsker发送选择改变，携带值为', e.target.value)
				this.index = e.target.value
			},
			tolist(){
				uni.navigateTo({
					url:`/pages/invoice/index`
				})
			},
			
			//提交
			confirm(){
				if(this.checknum == 2){
					if(this.itin == ''){
						this.$api.msg(`纳税人识别号不能为空！`);
						return false
					}
				}
				this.$Request.post4(
					this.$api.httpApi.user.editInvoice, {
						"uid": this.$SysCache.get('userInfo').id,
						"company_name": this.corpWholeName,
						"taxpayer_code": this.itin,
						"title": this.title,
						"email": this.email,
						"mobile": this.phone,
						"type":this.checknum,
						"id":this.id,
						"is_default":this.is_default?1:0
					}
				).then(res => {
					if (res.code == 1) {
						this.$api.prePage().refreshList();
						this.$api.msg(`发票信息${this.manageType=='edit' ? '修改': '添加'}成功`);
						setTimeout(()=>{
							uni.navigateBack()
						}, 800)
				
					}
				})
				
			},
			
		
			
		},
		onNavigationBarButtonTap: async function(e) {
			
			this.confirm()
			
		}
	}
</script>

<style lang="scss" scoped>
	page{
		background: $page-color-base;
		padding-top: 16upx;
		// padding: 20upx 58upx;
		padding: 0;
	}

	.row{
		display: flex;
		align-items: center;
		position: relative;
		padding:0 30upx;
		height: 75upx;
		background: #fff;
		
		.tit{
			flex-shrink: 0;
			min-width: 120upx;
			font-size:23upx;
			font-family:Microsoft YaHei;
			font-weight:400;
			color:rgba(102,102,102,1);
		}
		
		.input{
			flex: 1;
			font-size:23upx;
			font-family:Microsoft YaHei;
			font-weight:400;
			color:rgba(153,153,153,1);
			text-align: right;
			
		}
		.picker{
			flex: 1;
			font-size:23upx;
			font-family:Microsoft YaHei;
			font-weight:400;
			color:rgba(153,153,153,1);
			text-align: left;
		}
		.uni-input{
			font-size:23upx;
			font-family:Microsoft YaHei;
			font-weight:400;
			color:rgba(153,153,153,1);
		}
		.text{
			font-size:21upx;
			font-family:Microsoft YaHei;
			font-weight:400;
			color:rgba(153,153,153,1);
			line-height:33upx;
		}
		
		.icon-xia{
			// flex: 1;
			// text-align: right;
			font-size:28upx;
			font-family:Microsoft YaHei;
			font-weight:400;
			color:rgba(153,153,153,1);
		}
		.icon-you{
			// flex: 1;
			// text-align: right;
			font-size:23upx;
			font-family:Microsoft YaHei;
			font-weight:400;
			color:rgba(153,153,153,1);
		}
	}
	.info{
		padding: 10upx 27upx;
		background: #fff;
		margin-top: 11upx;
		.default-row{
			.tit{
				color:#999!important;
				flex: none;
			}
			.input{
				font-size:23upx;
				font-family:Microsoft YaHei;
				font-weight:400;
				color:rgba(102,102,102,1)!important;
			}
		}
		.row{
			display: flex;
			align-items: center;
			position: relative;
			padding:0 0;
			height: 75upx;
			background: #fff;
			
			.tit{
				flex-shrink: 0;
				min-width: 120upx;
				font-size:23upx;
				font-family:Microsoft YaHei;
				font-weight:400;
				color:rgba(102,102,102,1);
			}
			.addr-btn{
			
				width:94upx;
				height:44upx;
				background:rgba(255,255,255,1);
				border:1upx solid rgba(210, 210, 210, 1);
				border-radius:22upx;
				font-size:23upx;
				font-family:Microsoft YaHei;
				font-weight:400;
				color:rgba(102,102,102,1);
				display: flex;
				justify-content: center;
				align-items: center;
				margin-right: 30upx;
				
			}
			.active{
				background:rgba(240,64,111,1);
				color: #fff;
			}
			.input{
				flex: 1;
				font-size:23upx;
				font-family:Microsoft YaHei;
				font-weight:400;
				color:#999;
				// color:rgba(102,102,102,1);
				text-align: left;
				margin-left: 31upx;
				
			}
		
			
			.text{
				font-size:21upx;
				font-family:Microsoft YaHei;
				font-weight:400;
				color:rgba(153,153,153,1);
				line-height:33upx;
			}
		
		}
		
	}
	.default-row{
		
		.tit{
			flex: 1;
		}
		switch{
			transform: translateX(16upx) scale(.9);
		}
	}
	.add-btn{
		position: fixed;
		left: 30upx;
		right: 30upx;
		bottom: 100upx;
		z-index: 95;
		display: flex;
		align-items: center;
		justify-content: center;
		width:698upx;
		height:73upx;
		background:rgba(240,64,111,1);
		border-radius:36upx;
		font-size:23upx;
		font-family:Microsoft YaHei;
		font-weight:400;
		color:rgba(255,255,255,1);
	}
</style>
